body {
    -webkit-app-region: no-drag;
  }
.bg-blur {
    background: linear-gradient(117.76deg, rgba(255, 255, 255, 0.7) -7.21%, rgba(255, 255, 255, 0.5) 118.08%);
}
.custom-radio input:checked + label {
    background-color: #f7f9ff;
    border-color: #570df8;
    box-shadow: 0 1px 3px -1px rgba(0, 0, 0, 0.1), 0 0 3px -1px rgba(0, 0, 0, 0.05);
}
.custom-radio input:checked + label .text-gray-400 {
    color: #2d2f37;
}
.custom-dropdown.dropdown > .dropdown-content {
    right: 1rem;
}
.custom-dropdown > .menu li a {
    padding: 0.75rem 1rem;
}
.dropdown:hover > .dropdown-content {
    display: block;
    transform: translateX(20px);
}
.arrow_box:after,
.arrow_box:before {
    right: 100%;
    top: 28px;
    border: solid transparent;
    content: "";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    z-index: 2;
}
.arrow_box:after {
    /* border-color: rgba(136, 183, 213, 0); */
    border-right-color: #fff;
    border-width: 8px;
    margin-top: -8px;
}
.arrow_box:before {
    /* border-color: rgba(194, 225, 245, 0); */
    border-right-color: #f0f0f0;
    border-width: 10px;
    margin-top: -10px;
}

.cms-content h1 {
    font-weight: 600;
    font-size: 1.6rem;
    line-height: 1.8rem;
    color: #444;
    margin-bottom: 1.1rem;
}

.cms-content h2 {
    font-weight: 600;
    font-size: 1.3rem;
    line-height: 1.6rem;
    color: #444;
    margin-bottom: 10px;
}

.cms-content h3 {
    font-weight: 600;
    font-size: 1.1rem;
    line-height: 1.3rem;
    color: #444;
    margin-bottom: 10px;
}

.cms-content h4 {
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.2;
    color: #444;
    margin-bottom: 10px;
}

.cms-content h5 {
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.2;
    color: #444;
    margin-bottom: 10px;
}

.cms-content h6 {
    font-weight: 600;
    font-size: 1rem;
    line-height: 1;
    color: #444;
    margin-bottom: 10px;
}

.cms-content,
.cms-content p,
.cms-content ul,
.cms-content ol,
.cms-content table,
.cms-content blockquote p,
.cms-content pre {
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #5c5b5c;
}

.cms-content p,
.cms-content ul,
.cms-content ol,
.cms-content table,
.cms-content blockquote,
.cms-content pre {
    margin-bottom: 1rem;
}

.cms-content p strong,
.cms-content ul strong,
.cms-content ol strong,
.cms-content table strong,
.cms-content p strong,
.cms-content ul b,
.cms-content ol strong,
.cms-content table strong {
    font-weight: 600;
}

.cms-content ul ul,
.cms-content ul ol,
.cmscontent ol ul,
.cmscontent ol ol {
    margin-top: 5px;
    margin-bottom: 5px;
}

.cms-content ul li,
.cms-content ol li {
    margin: 6px 0;
}

.cms-content ul > li {
    list-style: disc;
    list-style-position: inside;
    padding-left: 0;
    margin-left: 10px;
}

.cms-content ol > li {
    list-style: decimal;
    list-style-position: inherit;
    padding-left: 0;
    margin-left: 15px;
}

.cms-content a {
    color: #5c5b5c;
    text-decoration: none;
}

.cms-content a:hover {
    color: #0b89d3;
    text-decoration: underline;
}

.cms-content table {
    border: solid 1px #5b5b63;
    border-collapse: collapse;
    vertical-align: top;
}

.cms-content table th,
.cms-content table td {
    padding: 5px 8px;
    border: solid 1px #5b5b63;
}

.cms-content table th {
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
    vertical-align: middle;
    text-align: left;
}

.cms-content table thead th {
    background: #444444;
    color: #fff;
}

.cms-content table tbody th {
    background: #444444;
    color: #fff;
}

.cms-content blockquote {
    font-size: 0.75rem;
    line-height: 1.25rem;
    margin-bottom: 1rem;
    padding-left: 15px;
    border-left: 4px solid #dfe2e5;
}

.cms-content blockquote p:last-child {
    margin-bottom: 0;
}

.cms-content pre {
    background-color: #f6f8fa;
    padding: 15px;
    color: #17141f;
    font-size: 13px;
    border-radius: 5px;
    white-space: break-spaces;
}
.cms-content code {
    color: #e83e9b;
}
.cms-content pre code {
    color: #17141f;
}

.no-readme {
    height: calc(100vh - 210px);
}
.no-readme img {
    margin-bottom: 20px;
    max-width: 320px;
}
.no-readme h3 {
    margin-bottom: 10px;
}
.no-readme p {
    margin: 0;
}
::-webkit-scrollbar {
    background-color: transparent;
    width: 10px;
}

/* background of the scrollbar except button or resizer */
::-webkit-scrollbar-track {
    background-color: transparent;
}

/* scrollbar itself */
::-webkit-scrollbar-thumb {
    background-color: #cacaca;
    border-radius: 4px;
    /* border: 1px solid #fff; */
}

/* set button(top and bottom of the scrollbar) */
::-webkit-scrollbar-button {
    display: none;
}
/**/
.left-side {
    height: calc(100vh - 106px);
}
/**/
.wel-list h3.text-sm a span,
.wel-list .text-sm {
    transition: all 0.6s ease-out;
}
.wel-list:hover h3.text-sm a span {
    padding-left: 5px;
}
/* Draggable css */
/* .draggable {
    -webkit-app-region: drag;
} */
.outputHeight,
.outputHeightForWelcome {
    height: 0;
    transition: height 0.1s ease-out;
    padding: 0;
}
.block.outputHeight,
.block.outputHeightForWelcome {
    transition: height 0.1s ease-in;
    height: calc(100vh - 145px);
    padding: 0.625rem 0.625rem 1rem;
}
.block.outputHeightForWelcome {
    height: calc(100vh - 29px);
}
.btnDisabled {
    cursor: no-drop;
    opacity: 0.5;
    filter: grayscale(100%);
}
.btnDisabled:hover {
    background-color: #e0e7ff;
    color: #312e81;
}
/**/
.tooltip-hover:hover .bottom-0.hidden {
    display: block;
}
.h-fit-content {
    height: fit-content;
}
.column-count {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}
.break-inside {
    break-inside: avoid-column;
}
.top-border {
    border-top: 1px solid #cecfce;
}
/**/
.left-side img {
    -webkit-backface-visibility: hidden;
    -ms-transform: translateZ(0); /* IE 9 */
    -webkit-transform: translateZ(0); /* Chrome, Safari, Opera */
    transform: translateZ(0);
}
/**/
.tail-checkbox {
    position: relative;
}
.tail-checkbox input:checked + div {
    border:none 0;
    transition: all .2s ease-in-out;
}
.tail-checkbox input:checked + div svg, .svg-bounce {
    display: block;
    transform: scale(1.3);
    border:none 0;
    animation: check 0.6s ease;
}
@keyframes check {
    50% {
      transform: scale(1.5);
    }
  }
  .kbd{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-width: 1px;
    border-color: hsl(var(--nf,var(--n))/var(--tw-border-opacity));
    --tw-border-opacity: .2;
    --tw-bg-opacity: 1;
    background-color: hsl(var(--b2,var(--b1))/var(--tw-bg-opacity));
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    border-radius: var(--rounded-btn,.5rem);
    border-bottom-width: 2px;
    min-height: 2.2em;
    min-width: 2.2em;
  }
